<template>
	<div class="container">
		<IForm :formFrame="frame" class="form-container" :formData.sync="form"></IForm>
		<div slot="action" style="display: flex; justify-content: flex-end;">
			<a-button class="btn" @click="cancel">取消</a-button>
			<a-button class="btn" type="primary" @click="submit">提交</a-button>
		</div>
		<!-- <AttrEditor :form.sync="form">
			<div slot="action">
				<a-button class="btn" @click="cancel">取消</a-button>
				<a-button class="btn" type="primary" @click="submit">提交</a-button>
			</div>
		</AttrEditor> -->

	</div>
</template>

<script>
// import AttrEditor from "./components/AttrEditor"
import IForm from "@/components/IForm"

const resourceType = 'advList'

export default {
	components: {
		IForm
		// AttrEditor
	},
	data () {
		return {
			form: {},
			imageTagList: []
		}
	},
  props: {
    uuid: {
      type: String
    }
  },
	computed: {
		imageTagOptions() {
	        return this.imageTagList.map(item => {
	          return {
	            title: item.title +'['+ item.account_id + ']',
	            value: item.id
	          }
	        })
	      },
		frame () {
			return [
					{
		        	title: '标题',
		        	key: 'title',
		         	required: true,
		        	newline: true,
		        },
				{
		            title: '广告主',
		            key: 'adv_id',
		            type: 'select',
		            required: true,
		            span: 12,
		            options: this.imageTagOptions
		          },
		        {
		        	title: '广告ID',
		        	key: 'aid',
		         	required: true,
		        	newline: true,
		        },
		        {
		        	title: '数据源',
		        	key: 'user_action_set_id',
		         	tips: '如果不填则使用广告主填的数据源',
		        	newline: true,
		        },
			]
		}
	},
	created () {
	},
	mounted () {
		this.uuid = this.uuid || this.$route.params.uuid
		this.initForm()
		this.$http.get('/adv').then(res => {
	        this.imageTagList = res.data.list
	    })
	},
	watch: {
    uuid () {
      this.initForm()
    }
	},
	methods: {
    initForm () {
      if (this.uuid) {
      	this.$http(`/${resourceType}/${this.uuid}`).then(res => {
      		this.form = res.data.info
      	})
      }
      else {
        this.form = {}
      }
    },
		cancel () {
      this.$emit('cancel')
			// this.$router.back(-1)
		},
		create () {
			this.$http.post(`/${resourceType}`, {
				...this.form
			}).then(res => {
				this.$message.success('创建成功')
        this.$emit('success')
        this.uuid = ''
        this.form = {}
				// this.$router.push({
				// 	path: './list'
				// })
			})
		},
		update () {
			this.$http.patch(`/${resourceType}/${this.uuid}`, {
				type: 'update',
				attributes: this.form
			}).then(res => {
				this.$message.success('更新成功')
        this.$emit('success')
        this.uuid = ''
        this.form = {}

				// this.$router.push({
				// 	path: '../list'
				// })
			})
		},
		submit () {
			if (this.uuid)
				this.update()
			else
				this.create()
		}
	}
}
</script>

<style lang="scss" scoped>
.form-container {
	padding-bottom: 120px;
}
.container {
	.btn {
		margin-right: 30px;
	}
}
</style>
